$color: #b532e9;

.comment-details {
  .comment-wrap {
    .goods {
      display: flex;
      margin: .5rem;
      .goods-img {
        flex-basis: 30%;
        img {
          width: 100%;
          height: 100%;
          box-shadow: 0 2px 8px #f0f1f2;
        }
      }
      .goods-name {
        padding-left: 1rem;
        font-size: 14px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }
    .comment-box {
      margin: 2rem .5rem .5rem;
      .title {
        font-size: 1.2rem;
        font-weight: bold;
        padding-bottom: 1rem;;
      }
      .comment-user {
        display: flex;
        align-items: center;
        height: 4rem;
        .user-img {
          width: 3rem;
          height: 3rem;
          img {
            width: 100%;
            height: 100%;
            border-radius: 50%;
          }
        }
        .comment-content {
          height: 100%;
          flex: 1;
          display: flex;
          flex-direction: column;
          justify-content: space-between;
          padding-left: 1rem;
          .top {
            display: flex;
            justify-content: space-between;
            align-items: center;
            font-size: .5rem;
          }
        }
      }
    }
  }
}